<template>
  <div class='wy-main matching-tendering wei_tendering'>
    <a-row class="wy-main-title" v-if="!detail">
      <a-col :span="24">
        <p class="title-p">
          <a-divider class="title-vertical" type="vertical" />
          <span class="title-span">政策法规发布</span>
          <a-divider class="title-divider" />
        </p>
      </a-col>
    </a-row>
    <div class="list_tab">
      <a-form :form="form" @submit="handleSubmit" class="wy-form">
          <a-form-item v-bind="formItemLayout" label="栏目">
            <a-select :disabled="disabled" style="width:280px" placeholder='请选择政策类型' v-decorator="[ 'contentType', { rules: [ {required: true, message: '政策类型不能为空！',}]}]" >
            <!--   <a-select-option key="1" :value="5">公示公告</a-select-option>
              <a-select-option key="2" :value="6" >国家政策</a-select-option>
              <a-select-option key="3" :value="7" >省内政策</a-select-option> -->
             <a-select-option v-for="(itme,index) in list" :key="index" :value="itme.dictKey">
            {{itme.dictValue}}
          </a-select-option>
            </a-select>
          </a-form-item>
        <a-form-item v-bind="formItemLayout" label="标题">
          <a-input :disabled="disabled" maxlength="50" v-decorator="[ 'contentTitle', { rules: [ {required: true, message: '标题不能为空！',}]}]" placeholder='请输入标题（50字以内）'   />
        </a-form-item>
        <a-form-item v-bind="formItemLayout" label="摘要">
          <a-textarea  :disabled="disabled" maxlength="200" :autosize="{ minRows: 4, maxRows: 6 }" v-decorator="[ 'contentLabel', { rules: [ {required: true, message: '招标说明不能为空！',}]}]"   placeholder='请输入摘要（200字以内）'/>
        </a-form-item>
        <a-form-item v-bind="formItemLayout" label="发布者">
          <a-input  disabled  v-model="admin1" />
        </a-form-item>
        <a-form-item v-bind="formItemLayout" label="来源">
          <a-input :disabled="disabled" v-decorator="[ 'contentOrigin', { rules: [ {required: true, message: '来源不能为空！',}]}]" placeholder='请输入来源'   />
        </a-form-item>
<!--         <a-form-item v-bind="formItemLayout" label="浏览权限">
        <a-radio-group @change="onChange" v-model="vipp">
          <a-radio :value="1">普通会员</a-radio>
          <a-radio :value="2">物流云会员</a-radio>
        </a-radio-group>
        </a-form-item> -->
        <a-form-item v-bind="formItemLayout" label="内容">
         <a-input :disabled="disabled" type='hidden'  v-decorator="[ 'contentxxx', { rules: [ {required: true, message: '内容不能为空！',}]}]" placeholder='请输入内容（5000字以内）'   />
         <div  id="editorElem" style="text-align:left"></div>
        </a-form-item>
          <div class="ant-row ant-form-item" v-if="!detail||type!='add'">
            <div class="ant-col-4 ant-form-item-label"></div>
            <div class="ant-col-10 ant-form-item-control-wrapper">
              <div class="ant-form-item-control">
                <span class="ant-form-item-children">
                  
                  <a-button type="primary"  html-type="submit" >
                    提交
                  </a-button>
                 <a-button style="margin-left: 10px;width:100px;" @click="reset">重置</a-button>
                  
                </span>
              </div>
            </div>
        </div>
      </a-form>
    </div>
   
  </div>
</template>
<script>
  import E from 'wangeditor'
  import { environment } from '@/environments/environment'
  import {checkTel, checkTelNum, checkEmail} from 'utils/formValidate'
  import {mapState, mapGetters,mapMutations} from 'vuex'
   const editor = new E('#editorElem')

  export default {
    name: 'editor',
    props: ['type','detail',"isSee"],
    data() {
      return {
        uploadUrl: environment.FileUploadUrl+'/fileupload/upload',// 图片上传地址
        FileUploadUrl2:environment.FileUploadUrl2,
        disabled:false,
        approvalStatus:106,
        loading: false,
        disabled:false,
         contentCode:16,
         list:[],
        vipp:1,
        admin1:'',
        fileList: [],
        contentTxt: '',
        contentxxx:'',
        formItemLayout: {
          labelCol: {
            xs: {
              span: 24
            },
            sm: {
              span: 4
            },
          },
          wrapperCol: {
            xs: {
              span: 24
            },
            sm: {
              span: 20
            },
          },
        },
      }
    },
    beforeCreate() {
      this.form = this.$form.createForm(this);
    },
    created() {
      this.getType(16)
        this.admin1 = this.$store.state.account.user.username;
        if(this.isSee){
          this.disabled = true
        }else{
          this.disabled = false
        }

        if(this.detail){
          let d = this.detail
          var tontext = d.contentTxt.replace(/<.*?>/g,"");
        // this.form.getFieldDecorator('vipp', { initialValue: 1, preserve: true });
           setTimeout(() => {
          this.form.setFieldsValue({
            contentType:d.contentType,
            contentTitle:d.contentTitle,
            contentLabel:d.contentLabel,
            contentOrigin:d.contentOrigin,
            // coverPath:d.coverPath,
            // coverPic:d.coverPic,
            // vipp:d.vipp,
            contentxxx:tontext,


          })
          }, 100);
        }
    },
    components: {
    },
    watch: {
       contentTxt(val) {
        console.log(val.replace(/<.*?>/g,""))
        if(val.replace(/<.*?>/g,"")){
            setTimeout(() => {
              this.form.setFieldsValue({
              contentxxx:1
              });
            }, 100);

        }else{
          setTimeout(() => {
              this.form.setFieldsValue({
              contentxxx:''
              });
            }, 100);
        }
        
      }
    },

    mounted: function() {
     
        editor.customConfig.onchange = (html) => {
          this.contentTxt = html
        }
      //如果需要使用 base64 编码直接将图片插入到内容中，可参考一下示例配置
        editor.customConfig.uploadImgShowBase64 = true;
        // 将图片大小限制为 10M
         editor.customConfig.uploadImgMaxSize = 10* 1024 * 1024;
        editor.create()

        if(this.detail){
          var content = editor.txt.html(this.detail.contentTxt);
          editor.txt.html(content);
        }

    },
    computed:{
      ...mapState(['setUser'])
    },
    methods: {
     // 获取字典类型
      getType(type){
        this.$get('/info/commonDict', {
          dictType: type
        }).then((r) => {
          if(type == 3){
            console.log(r)
          }
          switch(type){
            case 16: this.list = r.data.data.rows; break;
          }
        })
      },
      reset(){

        this.form.resetFields();
        this.contentTxt='';
        var content = editor.txt.html(this.contentTxt);
        editor.txt.html(content);
      
      },
      onChange(e){
        this.vipp = e.target.value;
      },

      //认证提交
      handleSubmit(e) {
        
        
        e.preventDefault();
        this.form.validateFieldsAndScroll((err, values) => {
         
          values.contentTxt = this.contentTxt
          // values.vipp = this.vipp
          values.contentCode = this.contentCode
          if(this.detail){
            values.contentId = this.detail.contentId
          }

          if(!err) {
              if(this.type =='edit'){
                values.approvalStatus = this.approvalStatus
                this.$put('content/content', values,true).then((r) => {
                if(r.status == 200){
                  this.$message.success(r.data.message);
                  this.form.resetFields();
                  this.$emit('handleCancel');
                }else{
                  this.$message.error(r.data.message);
                }
                this.loading = false;
              }).catch((e) => {
                this.loading = false;
              })
              }else{
              this.$post('content/content', values,true).then((r) => {
                if(r.status == 200){
                  this.$message.success(r.data.message);
                  this.form.resetFields();
                  this.contentTxt='';
                  var content = editor.txt.html(this.contentTxt);
                  editor.txt.html(content);
                }else{
                  this.$message.error(r.data.message);
                }
                this.loading = false;
              }).catch((e) => {
                this.loading = false;
              })
              }

            }

        });
      },
    }
  }
</script>

<style lang="less" scoped>

</style>